<template>
	<view class="container">
		<view class="input">
			<input type="text" v-model="code" placeholder="请输入CDK" placeholder-class="pla-class" />
		</view>
		<button>确认兑换</button>
	</view>
</template>

<script>
	import { receiveCoupon } from '@/utils/api/userApi.js'
	export default {
		data() {
			return {
				code:''
			};
		},
		methods:{
			receiveCoupon(){
				uni.showLoading({
					title:'领取中...'
				})
				receiveCoupon({
					type:'1',
					code:this.code
				}).then(res=>{
					uni.hideLoading()
					if(res.code==1){
						uni.showToast({
							title:'领取成功',
							icon:'none'
						})
						this.code = ''
					}
				})
			}
		}
	}
</script>
<style>
	page{
		background-color: #FFFFFF;
	}
</style>
<style lang="scss" scoped>
.container{
	padding: 20rpx 22rpx;
	box-sizing: border-box;
	.input{
		width: 100%;
		input{
			width: 100%;
			height: 80rpx;
			border: 1rpx solid #e7e7e7;
			border-radius: 20rpx;
			padding: 0rpx 20rpx;
			box-sizing: border-box;
		}
		/deep/ .pla-class{
			color: #B4B4B4;
			font-size: 28rpx;
			line-height: 40rpx;
			
		}
	}
	
	button{
		width: 100%;
		height: 96rpx;
		background: linear-gradient( 135deg, #FFA233 0%, #FB4C4C 100%);
		border-radius:80rpx;
		margin-top: 40rpx;
		font-weight: bold;
		font-size: 36rpx;
		color: #FFFFFF;
		line-height: 96rpx;
	}
}
</style>
